<template>
  <view class="truck-basic-info">
    <view class="truck-basic-first">
      <view style="float: left;width: 120rpx;height: 120rpx;">
        <image 
          mode="aspectFill"
          style="width: 120rpx;height: 120rpx;border-radius: 120rpx;"
          :src="data.frontPhoto"></image>
      </view>
      <view style="float: left;margin-left: 58rpx;">
        <view style="margin-top: 8rpx;">号牌：{{data.plateNo}}</view>
        <view style="margin-top: 18rpx;">年检日期：{{data.createTime}}</view>
      </view>
    </view>
    <view class="truck-basic-second">
      <view class="under-line item">
        <view class="key">车牌号码</view>
        <view class="value">{{data.plateNo}}</view>
      </view>
      <view class="under-line item">
        <view class="key">车辆类型</view>
        <view class="value">{{data.vehicleType}}</view>
      </view>
      <view class="under-line item">
        <view class="key">所有人</view>
        <view class="value">{{data.owner}}</view>
      </view>
      <view class="under-line item">
        <view class="key">住址</view>
        <view class="value">{{data.address}}</view>
      </view>
      <view class="under-line item">
        <view class="key">使用性质</view>
        <view class="value">{{data.useCharacter}}</view>
      </view>
      <view class="under-line item">
        <view class="key">品牌型号</view>
        <view class="value">{{data.model}}</view>
      </view>
      <view class="under-line item">
        <view class="key">车辆识别代码</view>
        <view class="value">{{data.vin}}</view>
      </view>
      <view class="under-line item">
        <view class="key">发动机号码</view>
        <view class="value">{{data.engineNo}}</view>
      </view>
      <view class="under-line item">
        <view class="key">注册日期</view>
        <view class="value">{{data.registerDate	}}</view>
      </view>
      <view class="item">
        <view class="key">发证日期</view>
        <view class="value">{{data.issueDate}}</view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        data:{}
      }
    },
    onLoad(option) {
      this.data = JSON.parse(decodeURIComponent(option.obj));
    },
    mounted() {
    },
    methods: {
      
    }
  }
</script>

<style lang="scss" scoped>
  .truck-basic-info {
    
    height: 100%;
    font-family: PingFangSC-Regular, PingFang SC;
    background-color: rgba(247, 247, 247, 1);
    .truck-basic-first {
      margin: 10rpx 0;
      background-color: white;
      padding: 24rpx 36rpx;
      height: 120rpx;
      line-height: 44rpx;
      color: rgba(242, 138, 48, 1);
      font-weight: 500;
      font-size: 32rpx;
    }
    .truck-basic-second {
      height: 1082rpx;
      padding: 0 18rpx;
      line-height: 106rpx;
      font-size: 28rpx;
      text-indent: 6rpx;
      background-color: white;
      .under-line {
        border-bottom: 2rpx solid rgba(238, 238, 238, 1);
      }
      .item {
        display: flex;
        .key {
          width: 190rpx;
          font-weight: 500;
          color: rgba(51, 51, 51, 1);
        }
        .value {
          width: 466rpx;
          font-weight: 500;
          color: rgba(170, 170, 170, 1);
          overflow: hidden;
          white-space: nowrap;
        }
      }
    }
  }
</style>
